<template>
	<view class="bgIndex">
		<sunui-navbar :items="tabList" lineHeight="70rpx" :isCenter="true" :currentIndex="currentIndex" padding="12rpx"
			activeColor="#785DF6" :size="100" activeLineBg="#785DF6" textAlign="center" activeLineWidth="100%"
			activeDirection="space-between" activeLineHeight="5rpx" bgColor="#fff" :margin="20"
			@change="e=>getChange(e,tabList[e].id)"></sunui-navbar>
		<view class="padding20">


			<view class="search-content ">

				<image class="search-img" :src="search" mode=""></image>
				<input placeholder="请搜索订单标题" v-model="searchVal" @input="changeInput" @confirm="changeSearch"
					style="width: auto;line-height: 1em; " placeholder-style="font-size:28rpx;color:#A1A1A1;" />

			</view>
			<mescroll-body ref="mescrollRef" :height="windowHeight+'rpx'" @init="mescrollInit" @down="downCallback"
				@up="upCallback" :up="upOption" :down="downOption">
				<view class="buildList" v-for="(item,index) in list" :key="index" @click.stop="goDeatilFn(item)">
					<!-- <view class="font-weight margin-bottom_20rpx flex-start-center" style="color: #666666;">
						<text>搭子号：dazizi252141541447</text>
						<view class="copy flex margin-left_10rpx">
							<text class="">
								复制
							</text>
						</view>
					</view> -->
					<view class="flex-end-top ">
						<view class="orderLocation">
							<image class="orderImg" :src="item.content_img" mode=""></image>

						</view>
						<view class="margin-left_16rpx flex-columns" style="width:454rpx;height: 200rpx;">
							<view class="font-overflow2 font-weight" style="width:100%">
								{{item.title}}


							</view>
							<!-- <view class=" font-overflow flex-between">

							<view class="flex-start-center">
								<image class="tagImg" src="../../static/第一行所有图标/组合 789.png" mode="aspectFit"></image>

								<view class="tagTitlePink flex">
									本地优先
								</view>
								<view class="tagTitleOrange  flex">
									情绪价值
								</view>
							</view>
							


						</view> -->

							<view class="font-overflow2" >
								<text style="color: #999999;">{{item.vice_title}}
								</text>


							</view>
							<view class="flex-between">
								<view class="flex-start-center" >
									<image class="avaterImg" :src="item.avatar" mode=""></image>
									<text style="color: #9D9D9D;max-width: 250rpx;" >{{item.nickname}}</text>
								</view>
								<view @click.stop="privateChat(item.service_order_uid)" class="privateChat flex-start-center">
									<image class="chatImg" :src="path5" mode=""></image>
									<text style="font-size: 24rpx;margin-bottom: 5rpx;">私聊TA</text>
								</view>
								<!-- <view class="flex-start-center">
								<view class="">
									<view class="flex-between v-p-share">
										<view class="v-m-width not-font-overflow flex1">
											<block v-for="(item, index) in detailInfo" :key="index">
												<image v-if="index<5" class="pt_img" :src="item.avatar"></image>
											</block>

										</view>

									</view>
								</view>
								<view class="" style="color: #9D9D9D;">
									<text>120参与</text>
								</view>
							</view> -->
							</view>


						</view>

					</view>
					<view style="margin-top: 15rpx;width: 100%;" class="flex-between">
						<view class="">
							<text>下单时间：{{item.create_time}}</text>
						</view>

					</view>

					<view class="flex-between margin-top_40rpx" style="width: 100%;">
						<view class="">
							<text>实付:<text style="color: red;">{{item.price}} {{currency_name}}</text></text>
						</view>
						<view class=" flex-end " v-if="item.order_status==2" @click.stop="completeServiceOrderFn(item.service_order_id)">

							<view class="endOrder  flex">
								结束订单
							</view>

						</view>
						<view class=" flex-end " v-if="item.order_status==1">
							<view class="rejectOrder flex" @click.stop="rejectOrderFn(item.service_order_id)">
								拒绝订单
							</view>
							<view class="acceptingOrders flex" @click.stop="takingOrders(item.service_order_id)">
								开始接单
							</view>

						</view>
					</view>
					<view class="orderStatus flex">
						<text>{{orderStatusFn(item.order_status)}}</text>
					</view>
				</view>
			</mescroll-body>
			<sunui-popup ref="myPackagePopup">
				<template v-slot:content>

					<view class="edit flex-column">
						<view class="top flex">

							<text>结束订单</text>

						</view>

						<sunui-upimg1 class="margin-top_20rpx" :border="'1px dashed #bfbfbf'" :formData="imgFormData"
							:storageMode="storageMode" :header="header" :size="['200rpx', '200rpx']" btnName="上传服务图"
							:uploadServerUrl="upPicUrl" ref="selectimgandupload1" @uploaded="imgLoaded1"
							@change="imgsChange1" :maxFileNumber="1"><template v-slot:icon>
								<uni-icons type="camera-filled" color="#1890FF" size="40"></uni-icons>
							</template></sunui-upimg1>
						<view class="">
							<view class="textarea-box">
								<textarea v-model="form.remark " placeholder="请输入结束服务说明 " maxlength="50"
									style="height: 150rpx;" />
								<!-- <view class="textarea-color">{{ form.remark }}/50</view> -->
							</view>


							<view class=" flex-around margin-top_30rpx">
								<view class="cancel flex" @click="cancel()">
									取消
								</view>
								<view class="sumbit-btn flex" @click="saveInfo()">
									确定
								</view>
							</view>
						</view>


					</view>

				</template>
			</sunui-popup>
			<sunui-popup ref="rejectPopup">
				<template v-slot:content>

					<view class="edit flex-column">
						<view class="top flex">

							<text>拒绝原因</text>

						</view>


						<view class="">
							<view class="textarea-box">
								<textarea v-model="form1.remark " placeholder="请输入拒绝 " maxlength="50"
									style="height: 150rpx;" />
								<!-- <view class="textarea-color">{{ form.remark }}/50</view> -->
							</view>


							<view class=" flex-around margin-top_30rpx">
								<view class="cancel flex" @click="cancel()">
									取消
								</view>
								<view class="sumbit-btn flex" @click="rejectBtn()">
									确定
								</view>
							</view>
						</view>


					</view>

				</template>
			</sunui-popup>
			
			<!-- 	<view class="buildList">
				<view class="font-weight margin-bottom_20rpx flex-start-center" style="color: #666666;">
					<text>搭子号：dazizi252141541447</text>
					<view class="copy flex margin-left_10rpx">
						<text class="">
							复制
						</text>
					</view>
				</view>
				<view class="flex-end-top ">
					<view class="orderLocation">
						<image class="orderImg" src="https://n8.weijuyunke.com/2024-06-07/f8292202406071854496600.png"
							mode=""></image>
						
					</view>
					<view class="margin-left_16rpx flex-columns" style="width:454rpx;height: 200rpx;">
						<view class="font-overflow2 font-weight" style="width:100%">
							端午节去长沙寻找组队搭子
			
			
						</view>
						
			
						<view class="font-overflow2">
							<text style="color: #999999;">全赛季的巅峰王者全能补位，巅峰赛1800全赛季的巅峰王者全能补位，巅峰赛1800 展开全赛季的巅峰王者全能补位，巅峰赛1800全赛季的巅峰王者全能补位，巅峰赛1800 展开全赛季的巅峰王者全能补位，巅峰赛1800全赛
				             </text>				
								
								
						</view>
						<view class="flex-between">
							<view class="flex-start-center">
								<image class="avaterImg" src="../../static/第一行所有图标/椭圆 4.png" mode=""></image>
								<text style="color: #9D9D9D;">123木子</text>
							</view>
							<view class="privateChat flex-start-center">
								<image  class="chatImg" :src="path5" mode=""></image>
								<text style="font-size: 24rpx;margin-bottom: 5rpx;">私聊TA</text>
							</view>
						
						</view>
			
			
					</view>
			
				</view>
				<view style="margin-top: 15rpx;width: 100%;" class="flex-between">
					<view class="">
						<text>发布时间：2024.10.32 15:32</text>
					</view>
			
				</view>
				
				<view class="flex-between margin-top_40rpx" style="width: 100%;">
					<view class="">
						<text>实付:<text style="color: red;">1000 </text></text>
					</view>
					 <view class=" flex-end " >
					     
						 <view class="endOrder  flex">
						 	结束订单
						 </view>
					 	
					 </view>
				</view>
				<view class="orderStatus flex">
					<text>已完成</text>
				</view>
			</view> -->

		</view>

	</view>
</template>

<script>
	export default {
		components: {

		},
		data() {
			return {
				currency_name:uni.getStorageSync('system').currency_name,
				path5:this.$img.path5,
				search:this.$img.search,
				userInfo: uni.getStorageSync("userInfo"),
				downOption: {
					auto: false
				},
				// 上拉配置项
				upOption: {
					auto: true
				},
				windowHeight: 0,
				currentIndex: 0,
				tabList: [{
					name: '全部',
					id: '0' //null
				}, {
					name: '待接单',
					id: '1' //null
				}, {
					name: '接单中',
					id: '2' //null
				}, {
					name: '完成',
					id: '3' //null
				}, {
					name: '已结算',
					id: '4' //null
				}, {
					name: '拒绝订单',
					id: '5' //null
				}, ],
				list: [],
				detailInfo: [],
				form: {
					remark: "",
					complete_img: '',
					id: ''
				},
				form1: {
					id: '',
					remark: "",
				},
				imgFormData: null,
				storageMode: "2",
				header: null,
				upPicUrl: null,
				img: [],
				imgStr: [],
				status: 0,
				searchVal: ''


			}
		},
		onLoad() {
			uni.getSystemInfo({
				success: (res) => {
					this.windowHeight = res.windowHeight * 2 - 800;
				}
			});
		},
		computed: {

			// 订单状态 '1 待审核 2 上架中 3 下架 4 驳回',
			orderStatusFn: function() {
				return function(status) {
					// 1 待接单 2 接单中 3 完成 4 已结算 4拒绝订单
					let orderStatus = '';

					orderStatus =
						status == 0 ? '待接单' : status == 1 ? '待接单' : status == 2 ? '接单中' : status == 3 ? '完成' :
						status == 4 ? '已结算' : '拒绝订单';

					return orderStatus;
				};
			},
		},

		onShow() {
			this.$nextTick(() => {
				this.mescroll?.resetUpScroll();
			})
			this.$at.releaseKey('completeSubmit');
			this.$at.releaseKey('submit');
			this.$at.releaseKey('refuseSubmit');
		},
		methods: {
			privateChat(id) {
				if(this.userInfo.disable==0){
					this.$sun.toast('该用户已被拉黑','none')
				}else{
					
					setTimeout(() => {
						this.$sun.navGo('/pagesB/index/HM-chat/HM-chat', {
							uid: id
						})
					})
				}
			},
			goDeatilFn(item){
				
				this.$sun.navGo('/pagesB/index/serviceDetails',{id:item.id,orderUser:true})
			
			},
			cancel() {
				this.$refs.myPackagePopup.close()
				this.$refs.rejectPopup.close()
			},
			changeInput(e) {
				console.log(e)
				this.searchVal = e.detail.value
				this.mescroll?.resetUpScroll();
			},
			getChange(index, id) {
				console.log(index, id)
				this.status = id
				this.currentIndex = index
				this.$nextTick(() => {
					this.mescroll?.resetUpScroll();
				})

			},

			descInput(e) {
				this.form.remark = e.detail.value.length;
				if (this.form.remark >= 50) {
					this.$sun.toast('说明字数已达上限');
				}
			},
			// 上传图片返回
			imgLoaded1(e) {
				console.log(e)

				this.img = [];
				for (let i = 0; i < e.length; i++) {
					this.img.push(e[i].url);
				}


				this.imgStr = this.img

				this.form.complete_img = this.imgStr.length === 1 ? this.imgStr[0].toString() : this.imgStr
					.join(',');
			},
			imgsChange1(file) {

				console.log('上传发生改变this.storageMode1111============', this.storageMode, '参数file', file);


				if (file.length) {
					this.upPicUrl = this.$api.upload;
					let filesNmae = 'nmoBackground_01.png'; // this.timeDate + 'png'
					this.imgFormData = {
						file: file,
						getsize: file.size,
						getContentType: ['image/png', 'image/jpeg'],
						getoriginalfilename: filesNmae,
						getName: filesNmae
					};
					this.$nextTick(() => {
						this.$refs.selectimgandupload1.upload(); //图片上传
					});
				} else {
					this.form.complete_img = '',
						this.imgStr = []
				}
				// this.niuyunLoop(file,0)

			},
			saveInfo() {
				if(this.form.complete_img&&this.form.remark){
					this.$at.uniDoFunc({
						key: 'completeSubmit',
						success: async () => {
							this.$at.lockKey('completeSubmit');
					
					
					
					
							const result = await this.$http.post({
								url: this.$api.completeServiceOrder,
								data: {
									...this.form
					
								},
								headers: {
									'Authorization': this.userInfo.token
								}
					
							})
							if (result.code == 0) {
								this.$refs.myPackagePopup.close()
								this.$sun.toast(result.message, 'none')
					
								setTimeout(() => {
									this.mescroll?.resetUpScroll();
								}, 500)
					
					
					
							} else {
								this.$sun.toast(result.message, 'none')
							}
					
							this.$at.releaseKey('completeSubmit');
						}
					});
				}else{
					this.$sun.toast('请上传服务图或者结束服务说明','none')
				}
			},
			// 结束订单
			completeServiceOrderFn(id) {
				if(this.userInfo.disable==0){
					this.$sun.toast('该用户已被拉黑','none')
				}else{
					this.form.id = id
					this.$refs.myPackagePopup.show({
						style: 'background-color:#fff;width:600rpx;border-radius:10rpx;padding:20rpx;overflow: scroll;',
						bottomClose: true,
						shadeClose: true,
						topclose: true
					});
				}


			},
			rejectBtn() {
				this.$at.uniDoFunc({
					key: 'refuseSubmit',
					success: async () => {
						this.$at.lockKey('refuseSubmit');

						if (!this.form1.remark) {
							this.$sun.toast('请填写拒绝说明', 'none')
							this.$at.releaseKey('refuseSubmit');
						} else {


							const result = await this.$http.post({
								url: this.$api.refuseServiceOrder,
								data: {
									...this.form1

								},
								headers: {
									'Authorization': this.userInfo.token
								}

							})
							if (result.code == 0) {

								this.$sun.toast(result.message, 'none')
								this.$refs.rejectPopup.close()
								setTimeout(() => {
									this.mescroll?.resetUpScroll();
								}, 500)



							} else {
								this.$sun.toast(result.message, 'none')
							}

							this.$at.releaseKey('refuseSubmit');
						}
					}
				});
			},
			rejectOrderFn(id) {
				if(this.userInfo.disable==0){
					this.$sun.toast('该用户已被拉黑','none')
				}else{
					this.form1.id = id
					this.$refs.rejectPopup.show({
						style: 'background-color:#fff;width:600rpx;border-radius:10rpx;padding:20rpx;overflow: scroll;',
						bottomClose: true,
						shadeClose: true,
						topclose: true
					});
				}

			},
			takingOrders(id) {
				if(this.userInfo.disable==0){
					this.$sun.toast('该用户已被拉黑','none')
				}else{
					this.$at.uniDoFunc({
						key: 'submit',
						success: async () => {
							this.$at.lockKey('submit');
					
					
					
							const result = await this.$http.post({
								url: this.$api.takingServiceOrder,
								data: {
									id: id
					
								},
								headers: {
									'Authorization': this.userInfo.token
								}
					
							})
							if (result.code == 0) {
					
								this.$sun.toast(result.message, 'none')
					
								setTimeout(() => {
									this.mescroll?.resetUpScroll();
								}, 500)
					
					
					
							} else {
								this.$sun.toast(result.message, 'none')
							}
					
							this.$at.releaseKey('submit');
						}
					});
				}
			},
			async upCallback(scroll) {

				const result = await this.$http.post({
					url: this.$api.myServiceOrder,
					data: {
						page: scroll.num,
						limit: 10,
						order_status: this.status,
						title: this.searchVal,
						is_oneself_uid: this.userInfo.id,




					},
					headers: {
						'Authorization': this.userInfo.token
					}

				})


				if (result.code == 0) {

					this.mescroll.endByPage(result.data.list.length, this.$sun.pagingSum(result.data.count, 10));
					if (scroll.num == 1) this.list = [];

					this.list = this.list.concat(result.data.list);

					// 		this.list.forEach((item) => {

					// 			item.labelList = item.label.split(",")
					// 		})



					console.log('this.list', this.list, this.list.length);
				} else {
					this.$sun.toast(result.message, 'none')
				}


			},
		}
	}
</script>

<style lang="less" scoped>
	.edit {
		.textarea-box {
			margin-top: 24rpx;
			border: 2rpx dashed #1e6ceb;
			background: #fff;
			padding: 30rpx;
			border-radius: 20rpx;

			.textarea-color {
				text-align: right;
				color: #999;
			}
		}

		.cancel {
			width: 268rpx;
			height: 96rpx;
			box-sizing: border-box;
			border: 1px solid rgb(1, 95, 255);
			background: rgb(255, 255, 255);
			border-radius: 60rpx;
		}

		.modifySuperior {}

		.sumbit-btn {

			width: 268rpx;
			height: 96rpx;



			height: 100rpx;
			color: #fff;
			border-radius: 60rpx;

			background-color: #785df6;
		}

		.image {
			width: 88rpx;
			height: 88rpx;
			border-radius: 50%;
		}

		.inputIphone {

			height: 108rpx;
			padding: 34rpx;
			border-radius: 20rpx;

			background: rgb(246, 246, 246);
		}

		.verificationCode {
			width: 36rpx;
			height: 36rpx;
		}

		.iphones {
			position: relative;

			.verificationCodes {
				z-index: 999;
				position: absolute;
				right: 16rpx;
				top: 23rpx;
				text-align: center;
				width: 170rpx;
				height: 65rpx;
				line-height: 65rpx;
				border-radius: 100rpx;
				font-size: 20rpx;
				border-radius: 20rpx;

				background: rgb(28, 110, 255);
				color: #fff;
			}
		}



	}

	.bgIndex {

		.search-content {

			// justify-content: center;
			display: flex;
			align-items: center;
			// margin: 20rpx;
			height: 76rpx;

			background: rgb(255, 255, 255);
			;
			border-radius: 84rpx;


			.search-img {
				width: 30rpx;
				height: 30rpx;
				margin-right: 20rpx;
				margin-left: 20rpx;
			}

			.address-img {
				width: 30rpx;
				height: 30rpx;
				margin-right: 10rpx;
				margin-left: 20rpx;
			}

			.icon_close {
				padding: 0rpx 15rpx;
				width: 36rpx;
				height: 36rpx;
				margin-right: 30rpx;
			}

		}

		.buildList {
			position: relative;
			display: flex;
			flex-direction: column;
			align-items: flex-start;
			padding: 20rpx;
			background: rgb(255, 255, 255);
			margin-top: 20rpx;
			border-radius: 20rpx;

			.copy {
				width: 78rpx;
				height: 42rpx;
				border-radius: 98rpx;
				color: #999999;
				background: rgb(240, 240, 240);
			}

			.privateChat {

				height: 24px;
				padding: 0 5rpx;
				box-sizing: border-box;
				border: 1px solid rgb(98, 54, 255);
				border-radius: 6px;
				color: #6236FF;
				background: rgb(255, 255, 255);

				.chatImg {
					width: 25.54rpx;
					height: 24.96rpx;
					margin-right: 5rpx;
				}
			}

			.contactHost {
				width: 158rpx;
				height: 52rpx;
				color: #785DF6;
				box-sizing: border-box;
				border: 2rpx solid rgb(120, 93, 246);
				border-radius: 116rpx;

				background: rgb(255, 255, 255);

				.chatImg {
					width: 25.54rpx;
					height: 24.96rpx;
					margin-right: 10rpx;
				}
			}

			.exitActivity {
				width: 158rpx;
				height: 52rpx;
				color: red;
				box-sizing: border-box;
				border: 2rpx solid red;
				border-radius: 116rpx;

				background: rgb(255, 255, 255);

				.chatImg {
					width: 25.54rpx;
					height: 24.96rpx;
					margin-right: 10rpx;
				}
			}

			.viewDetails {
				width: 158rpx;
				height: 52rpx;
				color: rgb(51, 51, 51);
				box-sizing: border-box;
				border: 2rpx solid rgb(240, 240, 240);
				border-radius: 116rpx;

				background: rgb(255, 255, 255);

				.chatImg {
					width: 25.54rpx;
					height: 24.96rpx;
					margin-right: 10rpx;
				}
			}

			.orderStatus {
				position: absolute;
				right: 0;
				top: 0;
				width: 106rpx;
				height: 48rpx;
				border-radius: 0rpx 20rpx 0rpx 20rpx;
				color: #fff;
				background: rgb(120, 93, 246);
			}

			.orderLocation {
				position: relative;

				.orderStatusImg {
					position: absolute;
					left: 0;
					top: 0;
					width: 106rpx;
					height: 48rpx;
					border-radius: 16rpx 0rpx 16rpx 0rpx;
					color: #fff;
					background: rgb(224, 32, 32);
					z-index: 999;
				}

				.orderStatusImged {
					position: absolute;
					left: 0;
					top: 0;
					width: 106rpx;
					height: 48rpx;
					border-radius: 16rpx 0rpx 16rpx 0rpx;
					color: #fff;
					border-radius: 16rpx 0rpx 16rpx 0rpx;

					background: rgb(0, 0, 0);
					z-index: 999;
				}
			}

			.acceptingOrders {
				width: 148rpx;
				height: 66rpx;
				border-radius: 0rpx 0rpx 18rpx 0rpx;
				color: #fff;
				background: rgb(250, 100, 1);
				margin: 0 -20rpx -20rpx 0;
			}

			.endOrder {
				width: 148rpx;
				height: 60rpx;
				border-radius: 20rpx 0rpx 18rpx 0rpx;
				color: #fff;
				background: rgb(224, 32, 32);
				margin: 0 -20rpx -20rpx 0;
			}

			.rejectOrder {
				width: 154rpx;
				height: 66rpx;
				border-radius: 20rpx 0rpx 0rpx 0rpx;
				color: #fff;
				background: rgb(0, 0, 0);
				margin: 0 0rpx -20rpx 0;
			}

			.orderStatused {
				position: absolute;
				right: 0;
				top: 0;
				width: 106rpx;
				height: 48rpx;
				border-radius: 0rpx 20rpx 0rpx 20rpx;
				color: #999999;
				background: rgb(236, 235, 235);
			}

			.tagImg {
				width: 118rpx;
				height: 38rpx;
			}

			.addImg {
				width: 30.02rpx;
				height: 30.02rpx;
			}

			.tagTitle {
				padding: 10rpx 20rpx;
				height: 36rpx;
				border-radius: 12rpx 12rpx 24rpx 12rpx;
				font-size: 20rpx;
				color: rgb(0, 198, 141);
				background: rgb(212, 255, 249);
				margin-right: 5rpx;
			}

			.avaterImg {
				width: 50rpx;
				height: 50rpx;
				border-radius: 50%;
				margin-right: 8rpx;
			}

			.tagTitleGay {
				padding: 10rpx 20rpx;
				height: 36rpx;
				border-radius: 12rpx 12rpx 24rpx 12rpx;
				font-size: 20rpx;
				color: #666666;
				background: #F5F5F5;
				margin-right: 5rpx;
			}

			.tagTitleOrange {
				padding: 10rpx 20rpx;
				height: 36rpx;
				border-radius: 12rpx 12rpx 24rpx 12rpx;
				font-size: 20rpx;
				color: rgb(238, 100, 41);
				background: rgba(238, 100, 41, 0.13);
				;
				margin-right: 5rpx;
			}

			.tagTitlePink {
				width: 116rpx;
				height: 36rpx;
				border-radius: 12rpx 12rpx 24rpx 12rpx;
				font-size: 20rpx;
				color: #F95CEF;
				background: #FFF2F8;
				margin-right: 5rpx;
			}

			.location {
				width: 110rpx;
				height: 48rpx;
				border-radius: 20rpx;

				background: rgb(235, 245, 255);
			}

			.v-p-share {
				padding: 2rpx 2rpx 0 2rpx;

				.v-m-width {
					margin-right: 40rpx;

					.pt_img {
						width: 50rpx;
						height: 50rpx;
						margin-right: -30rpx;
						border-radius: 50%;
					}
				}

				.v-share-friend {
					text {
						color: #294d7d;
						font-size: 24rpx;
						padding-right: 50rpx;
					}

					view {
						color: #ffffff;
						width: 154rpx;
						height: 58rpx;
					}
				}

				.v-share-friend2 {
					text {
						color: #294d7d;
						font-size: 24rpx;
					}
				}
			}

			.editImg {
				width: 20px;
				height: 20px;
				margin-bottom: 8rpx;
			}

			.orderImg {
				width: 192rpx;
				height: 192rpx;
				border-radius: 30rpx;


			}

			.addressImg {
				width: 28.5rpx;
				height: 28.12rpx;
			}
		}

		.PublishTag {
			z-index: 99;
			width: 95%;
			height: 102rpx;
			border-radius: 142rpx;
			color: #fff;
			position: fixed;

			bottom: 20rpx;
			background: rgb(120, 93, 246);
		}

	}
</style>